import { observable, action, computed, runInAction } from 'mobx'
import { post } from 'lib/net'
import CommonVM from 'cvm/common'
import * as api from 'lib/constants/api'
import lrz from 'lrz'
import Toast from 'components/toast'

export default class PostVM extends CommonVM {
  constructor (props) {
    super()
    this.history = props.history
  }

  // 帖子正文
  @observable content = ''
  // 选中图标
  @observable selectIcon = 'imgIcon'
  // 从相机添加的图片
  @observable selectedImages = []

  // 发送按钮样式
  @computed get submitStyle () {
    return this.content.length >= 7
    ? {background: '#15ae67', color: '#fff'}
    : {background: '#ededed', color: '#bcbcbc'}
  }

  // icon
  @computed get imgIcon () {
    return this.selectIcon === 'imgIcon'
    ? require('images/addImg.png')
    : require('images/addImg-gray.png')
  }

  // emoji
  @computed get emojiIcon () {
    return this.selectIcon === 'emojiIcon'
    ? require('images/smile-green.png')
    : require('images/smile.png')
  }

  // 选中图标
  @action handleChangeIcon = item => {
    this.selectIcon = item
  }

  // 修改正文内容
  @action handleChangeContent = e => {
    this.content = e.target.value
  }

  // 发送文本内容
  @action handlePostContent = async () => {
    if (this.content.length < 8 || this.content.length >= 800) return
    let imagesUrl = []
    this.selectedImages.forEach(item => {
      imagesUrl.push(item.url)
    })
    Toast.loading(1, '正在发送')
    let params = {userinfoId: this.userId, PostList: imagesUrl, Content: this.content}
    let res = await post(api.POST_UPLOAD, params)
    if (res.state === 1) {
      Toast.success('发送成功')
      this.history.push('mainText?' + res.data.PostID)
    } else {
      Toast.fail('发送失败')
    }
  }

  // 点击emoji
  @action handleEmojiItem = item => {
    this.content += item
  }

  // 删除图片
  @action handleDeleteImage = (image) => {
    let data = []
    this.selectedImages.forEach(item => {
      if (item.name !== image.name) {
        data.push(item)
      }
    })
    this.selectedImages = data
  }

  // 压缩图片
  @action compressImage = file => {
    Toast.loading(1, '正在压缩')
    lrz(file, {width: 800})
    .then(rst => {
      this.updateImage({Base64: rst.base64, ImageName: file.name})
    }).catch(() => {
      Toast.fail('压缩失败')
    })
  }

  // 上传图片
  @action updateImage = async params => {
    Toast.loading(1, '正在上传')
    let res = await post(api.IMAGE_UPLOAD64, params)
    if (res.state === 1) {
      let imageInfo = {
        img: params.Base64,
        url: res.data,
        name: params.ImageName
      }
      runInAction(() => {
        this.selectedImages.push(imageInfo)
      })
      Toast.loading(2)
    } else {
      Toast.fail('上传失败')
    }
    this.loading = false
  }

  // 相机图片选取回调，压缩图片
  @action handleImageChange = e => {
    let file = e.target.files[0]
    if (file && file.size <= 0) return
    for (var i = 0; i < this.selectedImages.length; i++) {
      if (this.selectedImages[i].name === file.name) {
        Toast.fail('重复照片')
        return
      }
    }
    this.compressImage(file)
    e.target.value = ''
  }
}
